import React from 'react';
import { BrowserRouter, Routes, Route } from 'react-router-dom';
import Navbar from './components/Navbar';
import Home from './pages/Home';
import AlgorithmList from './pages/AlgorithmList';
import BubbleSortPlayground from './pages/playgrounds/BubbleSortPlayground';
import SelectionSortPlayground from './pages/playgrounds/SelectionSortPlayground';
import InsertionSortPlayground from './pages/playgrounds/InsertionSortPlayground';
import QuickSortPlayground from './pages/playgrounds/QuickSortPlayground';
import BinarySearchPlayground from './pages/playgrounds/BinarySearchPlayground';
import './App.css';

function App() {
  return (
    <BrowserRouter>
      <div className="App">
        <Navbar />
        <Routes>
          <Route path="/" element={<Home />} />
          <Route path="/algorithms" element={<AlgorithmList />} />
          <Route path="/playground/bubble-sort" element={<BubbleSortPlayground />} />
          <Route path="/playground/selection-sort" element={<SelectionSortPlayground />} />
          <Route path="/playground/insertion-sort" element={<InsertionSortPlayground />} />
          <Route path="/playground/quick-sort" element={<QuickSortPlayground />} />
          <Route path="/playground/binary-search" element={<BinarySearchPlayground />} />
          
        </Routes>
      </div>
    </BrowserRouter>
  );
}

export default App;
